import * as echarts from '../../../ec-canvas/echarts.js';
import geoJson from 'data.js';
let chart = null;
let dataList = [{ name: 'china' }];
let pageInstance = {}
const db = wx.cloud.database();
const app = getApp();
// 2、进行初始化数据
function initChart(canvas, width, height) {
  chart = echarts.init(canvas, null, {
    width: width,
    height: height
  });
  canvas.setChart(chart);
  echarts.registerMap('china', geoJson);

  var option = {
    color: ['#c23531','#2f4554', '#61a0a8', '#d48265', '#91c7ae','#749f83',  '#ca8622', '#bda29a','#6e7074', '#546570', '#c4ccd3'],
    tooltip: {
      triggerOn: "click",
      formatter: function (e, t, n) {
        pageInstance.BindEvent(e);//锚定
        return e.name
      }
    },
    geo: {
      map: "china",
      roam: !1,
      scaleLimit: {
        min: 1,
        max: 2
      },
      zoom: 1.23,
      top: 120,
      label: {
        normal: {
          show: !0,
          fontSize: "10",
          color: "#555"
        }
      },
      itemStyle: {
        normal: {
          //shadowBlur: 50,
          //shadowColor: 'rgba(0, 0, 0, 0.2)',
          borderColor: "rgba(255, 255, 255, 0.2)"
        },
        emphasis: {
          areaColor: "#f2d5ad",
          shadowOffsetX: 0,
          shadowOffsetY: 0,
          borderWidth: 0
        }
      }
    },
    series: [{
      name: "来源信息",
      type: "map",
      geoIndex: 0,
      data: [
        {name: "北京市",itemStyle: {color: "#EAA78C"},vars:'beijing'},
        {name: "天津市",itemStyle: {color: "#F9CD82"},vars:'tianjin'},
        {name: "上海市",itemStyle: {color: "#9ADEAD"},vars:'shanghai'},
        {name: "重庆市",itemStyle: {color: "#9CB6E9"},vars:'chongqing'},
        {name: "河北省",itemStyle: {color: "#E49D9B"},vars:'heibei'},
        {name: "山西省",itemStyle: {color: "#97D7D7"},vars:'shanxi'},
        {name: "辽宁省",itemStyle: {color: "#ABA0CA"},vars:'liaoning'},
        {name: "吉林省",itemStyle: {color: "#9F8BEC"},vars:'jilin'},
        {name: "黑龙江省",itemStyle: {color: "#ACA4D5"},vars:'heilongjiang'},
        {name: "江苏省",itemStyle: {color: "#6495ED"},vars:'jiangsu'},
        {name: "浙江省",itemStyle: {color: "#7BCDA5"},vars:'zhejiang'},
        {name: "安徽省",itemStyle: {color: "#76B4EF"},vars:'anhui'},
        {name: "福建省",itemStyle: {color: "#E1C38F"},vars:'fujian'},
        {name: "江西省",itemStyle: {color: "#F6C46A"},vars:'jiangxi'},
        {name: "山东省",itemStyle: {color: "#B19ED1"},vars:'shandong'},
        {name: "河南省",itemStyle: {color: "#F09B98"},vars:'henan'},
        {name: "湖北省",itemStyle: {color: "#87CECB"},vars:'hubei'},
        {name: "湖南省",itemStyle: {color: "#D1A495"},vars:'hunan'},
        {name: "广东省",itemStyle: {color: "#89D196"},vars:'guangdong'},
        {name: "海南省",itemStyle: {color: "#FE9E9F"},vars:'hainan'},
        {name: "四川省",itemStyle: {color: "#93BAFF"},vars:'sichuan'},
        {name: "贵州省",itemStyle: {color: "#D999F9"},vars:'guizhou'},
        {name: "云南省",itemStyle: {color: "#81C784"},vars:'yunnan'},
        {name: "陕西省",itemStyle: {color: "#FFCA62"},vars:'shanxi'},
        {name: "甘肃省",itemStyle: {color: "#00BFFF"},vars:'gansu'},
        {name: "青海省",itemStyle: {color: "#FF8C00"},vars:'qinghai'},
        {name: "台湾省",itemStyle: {color: "#FF7F50"},vars:'taiwan'},
        {name: "内蒙古自治区",itemStyle: {color: "#90EE90"},vars:'neimenggu'},
        {name: "广西壮族自治区",itemStyle: {color: "#DED0E9"},vars:'guangxi'},
        {name: "西藏自治区",itemStyle: {color: "#87CEFA"},vars:'xizang'},
        {name: "宁夏回族自治区",itemStyle: {color: "#9370DB"},vars:'ningxia'},
        {name: "新疆维吾尔自治区",itemStyle: {color: "#FFC0CB"},vars:'xinjiang'},
        {name: "香港特别行政区",itemStyle: {color: "#4169E1"},vars:'xianggang'},
        {name: "澳门特别行政区",itemStyle: {color: "#6495ED"},vars:'aomen'},
      ]
    }]
  };

  chart.setOption(option);
  return chart;
}

Component({
  /**
   * 组件的属性列表
   */
  options: {
    addGlobalClass: true,
    multipleSlots: true
  },
  properties: {

  },

  /**
   * 组件的初始数据
   */
  data: {
    region:'山东',
    ec: {
      onInit: initChart
    },
    StatusBar: app.globalData.StatusBar,
    CustomBar: app.globalData.CustomBar,
    Custom: app.globalData.Custom,
    hasUserInfo: false,
    canIUse: wx.canIUse('button.open-type.getUserInfo'),
    TabCur: 1,
    scrollLeft: 0,
    citycounts:[],
  },

  /**
   * 组件的方法列表
   */
  lifetimes: {
    created: function () {
       pageInstance = this;
    }
  },
  methods: {
    getUserInfo: function (e) {
      console.log(e)
      app.globalData.userInfo = e.detail.userInfo
      this.setData({
        userInfo: e.detail.userInfo,
        hasUserInfo: true
      })
    },
    showModal(e) {
      this.setData({
        modalName: e
      })
    },
    hideModal(e) {
      this.setData({
        modalName: null
      })
    },
    
    BindEvent(e){
      var _ = this;
      var vars = e.data.vars;
      var region = e.name;
      console.log(region);
      //在这个地方请求rsync,且初始化图形数据
      wx.cloud.callFunction({
        name:'rsync',
        data:{
          url:'https://gwpre.sina.cn/interface/news/wap/historydata.d.json?province='+vars
        }
      }).then(res=>{
        console.log(res)
        _.setData({
          citycounts:res.result.data.city
        })
      })
      _.setData({
        region:region
      })
      _.showModal('viewModal');
    }
  }
})